<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>文章详情页</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/style.css">
</head>

<body class="bg-light">
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <a class="navbar-brand" href="#">
            <img src="/img/logo.png" width="30" height="30" alt="">
        </a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link" href="/">首页</a>
                </li>

                <% navs.forEach(nav => { %>
                <li class="nav-item">
                    <a class="nav-link" href="/article/recoms/<%= nav.id %>"><%= nav.name %></a>
                </li>
                <% }) %>
            </ul>


            <ul class="navbar-nav ml-auto">

                <% if(user) { %>
                <!--如果user存在-->
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" data-toggle="dropdown">
                        '<%= user.username %>'用户,您好
                    </a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="/user/<%= user.id %>">个人中心</a>
                        <a class="dropdown-item" href="/u_pre/exit">退出</a>
                        <a class="dropdown-item" href="mailto:1365137828@qq.com?Subject=反馈主题&body=反馈内容"
                            target="_top">联系站主</a>
                    </div>
                </li>
                <% } %>
                

                <% if( user && user.username == "1365137828" ) { %>
                <!--如果username是'1365137828'，即管理员-->
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" data-toggle="dropdown">
                        管理员用户
                    </a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="/admin/">去后台</a>
                    </div>
                </li>
                <% } %>

            </ul>
        </div>
    </nav>
    <div class="container mt-4">
        <nav>
            <ol class="breadcrumb bg-white">
                <li class="breadcrumb-item"><a href="/">首页</a></li>
                <li class="breadcrumb-item"><a
                        href="/article/recoms/<%= rec_detail.category_id %>"><%= rec_detail.name %></a></li>
                <li class="breadcrumb-item active"><%= rec_detail.title %></li>

            </ol>
        </nav>
        <div class="card">
            <div class="card-header bg-white">
                <h3 class="card-title m-0"><%= rec_detail.title %></h3>
                <p class="text-muted small mt-2 m-0">
                    <span class="mr-3">发表时间：<%= rec_detail.time.toLocaleString() %></span>
                    <span class="mr-1">点击：<%= rec_detail.hits %></span>
                </p>
            </div>

            <!--使用'='会表示按照字符输出，不会解析html元素，那么就使用'-'，它会解析html元素-->
            <div class="card-body"><%- rec_detail.content %></div>
            <div class="card-footer bg-white border-0">

                <% tabs_det.forEach(tab => { %>
                <span class="badge badge-pill"><%= tab.name %></span>
                <% }) %>

            </div>
        </div>
        
    </div>
    <footer class="bg-dark p-3 mt-3  text-center text-secondary small">
        <a href="#" class="text-secondary small">陕ICP备1111111号</a>
    </footer>


    <script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.slim.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/js/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/holder/2.9.6/holder.min.js"></script>
    <script src="/js/public.js"></script>
    <script src="/js/my.js"></script>
</body>

</html>